<template>
  <virtual-table-layout :form-title="`合同采购清单(${queryParams.pageNo})`">
    <virtual-table
      :handler-get-list="getDetail"
      v-model:page-no="queryParams.pageNo"
      v-model:page-data="pageData"
      :total="queryParams.total"
      :page-size="queryParams.pageSize"
    >
      <view class="mb10">
        <view class="form-title-1">货物清单</view>
        <d-card>
          <pm-file-upload readonly :files="goods"></pm-file-upload>
        </d-card>
      </view>
      <view v-for="(page, key) in pageData" :key="page.pageNo">
        <view class="pm-pt-item mb10" v-for="(item, key) in page.list" :key="'pm-pt-item_' + key">
          <d-card>
            <d-forms disabled label-width="200rpx">
              <d-forms-item label="产品/设备名称" :input="item.name"></d-forms-item>
              <d-forms-item label="品牌/厂商" :input="item.firmName"></d-forms-item>
              <d-forms-item label="型号" :input="item.model"></d-forms-item>
              <d-forms-item label="总数" :input="item.num"></d-forms-item>
              <d-forms-item label="已申请数量" :input="item.appliedNum"></d-forms-item>
              <view>
                <view class="form-title-1">参数规格</view>
                <d-forms-item disabled :input="item.specifications"></d-forms-item>
              </view>
              <view>
                <view class="form-title-1">备注</view>
                <d-forms-item disabled :input="item.remarks"></d-forms-item>
              </view>
            </d-forms>
          </d-card>
        </view>
      </view>
    </virtual-table>
  </virtual-table-layout>
</template>

<script setup lang="ts">
import VirtualTableLayout from "@/components/VirtualTableLayout/index.vue";
import {DFormInputType} from "@/utils/enum";
import {useContractPurchaseApi} from "@/api/pm/project/contractPurchase";

const triggered = ref<boolean>(false);
const pageData = ref<VirtualTableData<ContractProcForm>[]>([]);

function getDetail() {
  return new Promise((resolve, reject) => {
    if (projectNumber.value) {
      getGoods();
      useContractPurchaseApi().getContractPurchaseItemPage({
        projectNumber: projectNumber.value,
        ...queryParams
      }).then(res => {
        if (res.code === 0 && res.data) {
          queryParams.total = res.data.total;
          resolve(res.data.list);
        } else {
          reject(res.data)
        }
      }).catch((err) => {
        reject(err);
      })
    } else {
      resolve([])
    }
  })
}

const goods = ref<string>(null);
function getGoods() {
  useContractPurchaseApi().getContractManifestFile(projectNumber.value).then(res => {
    if (res.code === 0 && res.data) {
      goods.value = res.data;
    }
  })
}

const queryParams = reactive<{
  pageSize: number,
  pageNo: number,
  total: number,
}>({
  pageSize: 5,
  pageNo: 1,
  total: 0,
})

const projectNumber = ref<string>();
onLoad((query) => {
  projectNumber.value = query['project_number'];
  getDetail()
})
</script>

<style scoped lang="scss">

</style>
